<template>
	<view>
		<uni-forms label-width="100" :rules="rules" :value="formData" ref="form" err-show-type="toast">
			<uni-forms-item label="商品名称" required name="productName" error-message="11">
				<uni-easyinput  :maxlength="11" type="text"  placeholder="请输入商品名称" v-model="formData.productName"/>
			</uni-forms-item>
			<uni-forms-item label="商品品牌" name="productBrand" error-message="11">
				<uni-easyinput  :maxlength="11" type="text"  placeholder="请输入商品品牌" v-model="formData.productBrand"/>
			</uni-forms-item>
			
			<view class="goodsInfo-img">
				<view class="goodsInfo-img-title"><text>*</text>商品图</view>
				<view class="goodsInfo-img-bottom">
					<u-upload-image
						:fileKey="fileKey"
						:token="qinuiToken"
						:file-list="formData.certificateUrlList"
						:limit="1"
						@on-success="uploadSuccess"
						@on-error="uploadError"
						@on-remove="uploadRemove"
					/>
					<view class="goodsInfo-bottom-right">
						<view class="goodsInfo-bottom-logo"><image src="../../static/icon_logo.png" class="logo"></image></view>
					</view>
				</view>
			</view>
			
			<uni-forms-item label="所属类目" required name="category" error-message="11">
				<uni-easyinput  :maxlength="11" type="text"  placeholder="请输入药品所属类目" v-model="formData.category"/>
			</uni-forms-item>
			
			<uni-forms-item :label-width="200" label="药品类型" required name="typeMedicine">
				<!-- <uni-data-checkbox v-model="formData.hobby" :localdata="selectIs" /> -->
			</uni-forms-item>
			<view class="goodsInfo-section"><axb-check-box ref="radio" :list="typedrug" @change="typeMedicineChange"></axb-check-box></view>
			
			<uni-forms-item label="商品条码" required name="readyCode" error-message="11" class="goodsInfo-ready">
				<uni-easyinput :maxlength="11" type="text"  placeholder="请扫描药盒上的一维码" v-model="formData.readyCode"/>
			</uni-forms-item>

			<uni-forms-item label="商品规格" required name="specification" error-message="11" class="goodsInfo-ready">
				<uni-easyinput  :maxlength="11" type="text"  placeholder="例：10g*9包/盒" v-model="formData.specification"/>
			</uni-forms-item>
			
			<uni-forms-item label="药品底价" required name="lowPrice" error-message="11" class="goodsInfo-ready">
				<uni-easyinput  :maxlength="11" type="text"  placeholder="请输入" v-model="formData.lowPrice"/>
			</uni-forms-item>
			
			<view class="goodsInfo-pricing">
				<view class="goodsInfo-pricing-list" style="width: 236rpx;" name="offline">
					<view class="goodsInfo-pricing-title"><text>*</text>线下售价</view>
					<input type="text" placeholder="请输入" maxlength="8" v-model="formData.offline"/>
				</view>
				<view class="goodsInfo-pricing-list" style="width: 250rpx; margin: 0 46rpx;" name="meituan">
					<view class="goodsInfo-pricing-title"><text>*</text>美团售价</view>
					<input type="text" placeholder="请输入" maxlength="8" v-model="formData.meituan"/>
				</view>
				<view class="goodsInfo-pricing-list" style="width: 262rpx; margin: 0 32rpx 0 22rpx;" name="eleme">
					<view class="goodsInfo-pricing-title"><text>*</text>饿了么售价</view>
					<input type="text" placeholder="请输入" maxlength="8" v-model="formData.eleme"/>
				</view>
			</view>
			
		</uni-forms>
		
		<view class="goodsInfo-submit">提交审核</view>
		
	</view>
</template>

<script>
	import uniForms from '@/components/uni/uni-forms/uni-forms.vue';
	import uniFormsItem from '@/components/uni/uni-forms-item/uni-forms-item.vue';
	import uUploadImage from '@/components/u-upload-image/u-upload-image.vue';
	import uniEasyinput from '@/components/uni/uni-easyinput/uni-easyinput.vue';
	import axbCheckBox from '@/components/axb-checkbox/axb-checkbox.vue';
	export default {
		components: {
			uniForms,
			uniFormsItem,
			uUploadImage,
			uniEasyinput,
			axbCheckBox,
		},
		data() {
			return {
				qinuiToken: '',
				fileKey: 'file-key',
				formData: {
					productName: '', //商品名称
					productBrand: '', //商品品牌
					certificateUrlList: [], //凭证图片url,多图片由||隔开(英文下的双竖线)
					category: '', //所属类目
					typeMedicine: '', //药品类型
					readyCode: '', //扫描一维码
					specification: '', //商品规格
					lowPrice: '', //药品底价
					offline: '', //线下售价
					meituan: '', //美团售价
					eleme: '', //饿了么售价
				},
				typedrug: [
					{
						name: '未知',
						value: 0,
						checked: 1
					},
					{
						name: '甲类OTC',
						value: 1,
						checked: 0
					},
					{
						name: '乙类OTC',
						value: 2,
						checked: 0
					},
					{
						name: '处方药',
						value: 3,
						checked: 0
					}
				]
			}
		},
		onLoad() {

		},
		methods: {
			uploadSuccess(e) {
				this.formData.certificateUrlList.push(qiniuUrl + e.key);
				this.qiniuUploadToken();
			},
			uploadError(e) {
				uni.showToast({
					title: '文件上传失败',
					icon: 'none'
				});
			},
			uploadRemove(e) {
				this.formData.certificateUrlList.splice(e, 1);
			},
			//药品类型
			typeMedicineChange(e) {
				this.formData.typeMedicine = e;
			},
		}
	}
</script>

<style lang="less">
	@import './goodsInfo.less';
</style>
